<meta charset="utf-8"/>
<div class="row">
  <div class="col-xs-12">
    <div class="row">
      <div class="col-xs-12">
        <div style="height:36px;margin-top:2px">
          <table class="no-border" style="display:inline">
            <tr>
              <td permission='integral_buy_btn_listData' style="padding-right:6px;display:none">
                购买人
              </td>
              <td permission='integral_buy_btn_listData' style="display:none">
                <input type="text" id="key_buyer" class="form-control search-query" placeholder="输入购买人账号" style="width:158px"/>
              </td>
              <td permission='integral_buy_btn_listData' style="padding-right:6px;display:none">
                收款人
              </td>
              <td permission='integral_buy_btn_listData' style="display:none">
                <input type="text" id="key_payee" class="form-control search-query" placeholder="输入收款人账号" style="width:158px"/>
              </td>
              <td permission='integral_buy_btn_listData' style="padding-right:6px;display:none">
                订单号
              </td>
              <td permission='integral_buy_btn_listData' style="display:none">
                <input type="text" id="key_out_trade_no" class="form-control search-query" placeholder="输入订单号" style="width:158px"/>
              </td>
              <td permission='integral_buy_btn_listData' style="padding:0 6px;display:none" class="hidden-480">
                购买时间
              </td>
              <td permission='integral_buy_btn_listData' style="display:none" class="hidden-480">
                <input type="text" id="add_date_start" placeholder="起始日期时间" readonly class="form-control search-query" maxlength="19" style="width:144px;cursor:pointer" title="请选择购买时间起始时间"/>
              </td>
              <td permission='integral_buy_btn_listData' style="display:none" class="hidden-480">
                <i class='fa fa-exchange'></i>
              </td>
              <td permission='integral_buy_btn_listData' style="display:none" class="hidden-480">
                <input type="text" id="add_date_end" placeholder="结束日期时间" readonly class="form-control search-query" maxlength="19" style="width:144px;cursor:pointer" title="请选择购买时间结束时间"/>
              </td>
              <td permission='integral_buy_btn_listData' style="padding:0 6px;display:none" class="hidden-480">
                积分类型
              </td>
              <td permission='integral_buy_btn_listData' style="display:none">
                <div class="input-group">
                  <span class="input-group-btn"><button type="button" class="btn btn-inverse btn-white" id="btnSearch" title="搜索查询"><span class="ace-icon fa fa-search bigger-110"></span>搜索</button></span>
                </div>
              </td>
              <td permission='integral_buy_btn_listData' style="display:none" class="hidden-480">
                <div class="input-group">
                  <span class="input-group-btn"><button type="button" class="btn btn-inverse btn-white" id="btnReset" title="重置清空搜索关键字"><span class="ace-icon fa fa-undo bigger-110"></span>重置</button></span>
                </div>
              </td>
            </tr>
          </table>
          <div class="hidden-480 pull-right tableTools-container" permission='integral_buy_btn_listData' style="display:none;margin-bottom:2px"></div>
        </div>
        <table id="tableListUserIntegralBuy" class="table table-striped table-bordered table-hover">
          <tbody>
          <tr>
            <td style="text-align:center;height:37px">正在加载……</td>
          </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
<div id="divKeyColumns" style="display:none;padding:1px 0px;"></div>
<div style="display:none;">
  <input type="hidden" id="integral_buy_btn_listData"/>
  <input type="hidden" id="integral_buy_row_queryById"/>
</div>
<div class="panel-group" id="accordion" aria-multiselectable="true" style="display:none;padding-top:2px;"></div>
<script type="text/javascript">
  ;(function($){
    var tableDom = '#tableListUserIntegralBuy';
    var urlRoute = '/userIntegralBuy/';/*请求controller层的url*/
    var getList = urlRoute + 'listData';/*获取数据列表*/
    var urlAdd = urlRoute + 'add';/*添加*/
    var urlEdit = urlRoute + 'edit';/*编辑*/
    var urlQueryById = urlRoute + 'queryById';/*根据id查询对应的数据*/
    var stateOriginal = {};//仅供参考，更新优化-选项1,可参考项目law-frontend的页面serviceAd.html和后端law-backend的ServiceADService.java;记录编辑的值,仅在编辑时可用
    var thisTable = null;
    thisPage = {
      init : function(){
        this.initTable();
        this.createDropdown();
        this.initDom();
        this.addEvent();
      },
      initDom : function(){
        laydate.render({
          elem: '#add_date_start',//指定元素
          format : 'yyyy-MM-dd HH:mm:ss',/*格式*/
          showBottom : true,/*是否显示底部栏*/
          type: 'datetime'/*格式,datetime|date|time*/
        });
        laydate.render({
          elem: '#add_date_end',
          format : 'yyyy-MM-dd HH:mm:ss',/*格式*/
          showBottom : true,/*是否显示底部栏*/
          type: 'datetime'/*格式,datetime|date|time*/
        });
        laydate.render({
          elem: '#add_date',//指定元素
          format : 'yyyy-MM-dd HH:mm:ss',/*格式*/
          showBottom : true,/*是否显示底部栏*/
          type: 'datetime'/*格式,datetime|date|time*/
        });
      },
      createDropdown: function(){
      },
      addEvent: function(){
        $('#btnAdd').on('click', function(){
          thisPage.edit();
        });
        //搜索按钮
        $('#btnSearch').on('click', function(){
          thisPage.search();
        });
        //重置按钮
        $('#btnReset').on('click', function(){
          $('#key_buyer').val('');
          $('#key_payee').val('');
          $('#key_out_trade_no').val('');
          $('#labelSearch_type').text('选择积分类型');
          $('#add_date_start').val('');
          $('#add_date_end').val('');
        });
        //按钮组-自定义显示列
        $('#iconColumn').parent().parent().on('click', function(){
          pageDataTable.columnCustom(thisTable, tableDom,'#divKeyColumns');
        });
        //按钮组-搜索
        $('#iconRefresh').parent().parent().on('click', function(){
          thisPage.search();
        });
      },
      /**获取已选中的主键集合,用法:var kids = thisPage.getKeyIds();if(kids == null){layerFn.alert('请选择要操作的数据', AppKey.code.code199);return;}*/
      getKeyIds : function(){
        var arrays = thisTable.rows({selected : true}).data();//获取已勾选的数据行
        if(arrays.length == 0){
          return null;
        }
        var kids = '';
        for(var i = 0; i < arrays.length; i++){
          var value = arrays[i].kid;
          if(value != ''){
            if(kids.length > 0) kids += ",";
            kids += value;
          }
        }
        return kids;
      },
      initTable : function(){
        var optsVisible = getOptsVisible('integral_buy_row');//确定是否要显示操作选项,若是多个按钮权限时以逗号,隔开
        var aoColumns = [];
        aoColumns.push({
          data : "buyUser",
          sortable : true,
          title : "购买人账号"
        });
        aoColumns.push({
          data : "buyerName",
          sortable : false,
          title : "购买人姓名"
        });
        aoColumns.push({
          data : "user_name",
          sortable : true,
          title : "收款人账号",
          render : function(value,type,row,meta){
            if(value){
              return value;
            }else{
              return "总公司(区代进货)";
            }
          }
        });
        aoColumns.push({
          data : "payeeName",
          sortable : false,
          title : "收款人姓名"
        });
        aoColumns.push({
          data : "out_trade_no",
          sortable : false,
          width : "158px",
          title : "订单号"
        });
        aoColumns.push({
          data : "score",
          sortable : false,
          class: 'text-center',
          width: "150px",
          title : "支付积分数"
        });
        aoColumns.push({
          data : "add_date",
          sortable : true,
          title : "购买时间",
          width: "128px",
          class: 'text-center',
          render : function(value){
            if(value){
              return winFn.formatDate(value,true);
            }else{
              return "";
            }
          }
        });
        if(optsVisible){
          aoColumns.push({
            data : "_kid_",
            width : "75px",
            class: 'text-center',
            title : "<label style='color:#000;margin-left:6px;' title='单行操作'>操作选项</label>",/*此处的字‘操作选项’请勿修改,此处的文字还有其它用途*/
            sortable : false
          });
        }
        var columnDefs = [];
        if(optsVisible){//是否来显示某列
          columnDefs.push({
            targets : -1,
            render : function(value,type,row,meta){
              return "<a href='javascript:thisPage.rowOrderInfo("+ meta.row +");' style='outline:none;text-decoration:none;display:none' permission='integral_buy_row_queryById'>订单详情</a>";
            }
          });
        }
        columnDefs.push({
          targets : [0,1,2,3,4,5,6,7],
          render : function(value,type,row,meta){
            return pageDataTable.formatColumn(value);
          }
        });
        columnDefs.push({
          visible : false,//列的隐藏显示
          targets : []//指定列索引
        });
        thisTable = pageDataTable.initDataTable({
          tableDom : tableDom,
          sAjaxSource : getList,
          fnServerParams : function(params){
            params.push(
              {"name":"buyerAccount","value":winFn.getDomValue('#key_buyer')},
              {"name":"payeeAccount","value":winFn.getDomValue('#key_payee')},
              {"name":"out_trade_no","value":winFn.getDomValue('#key_out_trade_no')},
              {"name":"add_date_start","value":winFn.getDomValue('#add_date_start') ? new Date(winFn.getDomValue('#add_date_start').replace(new RegExp("-","gm"),"/")).getTime()/1000 : ''},
              {"name":"add_date_end","value":winFn.getDomValue('#add_date_end') ? new Date(winFn.getDomValue('#add_date_end').replace(new RegExp("-","gm"),"/")).getTime()/1000 : ''}
            );
          },
          aoColumns : aoColumns,
          columnDefs : columnDefs,
          complete : function(settings,data){},
          selected : function(selected){}
        });
        pageDataTable.buttons(thisTable);
        pageDataTable.action(thisTable);
        pageDataTable.select(thisTable, tableDom);
        pageDataTable.tooltip();
        $('.dataTables_scroll .dataTables_scrollBody').removeAttr('style');//解决dataTable表头下拉框被tbody遮挡
      },
      search: function(){
        if(verifyFn.inputCheck('#integral_buy_btn_listData','没有操作权限')) return;
        $(tableDom + '_wrapper table input[type=checkbox]').prop('checked',false);
        thisTable.draw();
      },
      resetForm: function(){
        winFn.clearFormData('#form_user_integral_buy_edit',[{'dropdownLabel_type':'选择积分类型'}]);
      },
      rowOrderInfo: function(rowIndex){
        if(verifyFn.inputCheck('#integral_buy_row_queryById','没有操作权限')) return;
        var row = thisTable.row(rowIndex).data();
        layerFn.queryByIdHint(urlQueryById, row.kid, function(data){
          thisPage.openDialog(data,row.score);
        });
      },
      //移除不需要对比的key(此方法可有可无)
      editJson : function(data,keys){
        if(keys){
          for(var h = 0; h < keys.length; h++){
            delete data[keys[h]];//删除key元素
          }
        }
        stateOriginal = data;
      },
      //对比是否已修改了值,仅需判断必填的字段，文件上传的字段单独处理
      filterValue : function(params){
        if(stateOriginal != null){
          var ignoreKeys = '';
          var requiredKeys = '';
          for(var so in stateOriginal){
            if(params[so] == stateOriginal[so]){
              delete params[so];
              if(ignoreKeys != ''){
                ignoreKeys += ','+so;
              }else{
                ignoreKeys += so;
              }
            }else{
              if(requiredKeys != ''){
                requiredKeys += ','+so;
              }else{
                requiredKeys += so;
              }
            }
          }
          if(ignoreKeys != ''){
            params['ignoreKeys'] = ignoreKeys;//记录后端忽略验证的key以,隔开的字符串,注意数据库字段是否允许为空,可参考项目law-backend的joins.html;law-backend的JoinsService的方法edit();
          }
          if(requiredKeys != ''){
            params['requiredKeys'] = requiredKeys;//记录后端必填验证的key以,隔开的字符串
          }
        }
      },
      openDialog : function(map,totalFee){
        $('#accordion').empty();
        var goodsOrder = map.data.goodsOrder || {};
        var orderDetails = map.data.orderDetails || [];
        var outTradeNo = goodsOrder.out_trade_no || '未知';
        var panel = "<div class='panel panel-default'><div class='panel-heading' role='tab' id='heading"+'One'+"'></div><div id='collapse"+'One'+"' class='panel-collapse collapse in' role='tabpanel' aria-labelledby='heading"+'One'+"'> </div> </div>";
        var panelTitle = "<h4 class='panel-title'><a style='outline:none;text-decoration:none;' class=\"collapsed\" role=\"button\" data-toggle=\"collapse\" data-parent=\"#accordion\" href=\"#collapseOne\" aria-expanded=\"false\" aria-controls=\"collapseOne\"><div class=\"row\"><div class=\"col-sm-6\">订单编号："+outTradeNo+"</div><div class=\"col-sm-5 text-right\">销售额：￥"+totalFee+"</div></div></a></h4>";
        var panelBody = "<div class=\"panel-body\"></div>";
        $("#accordion").append(panel);
        $("#headingOne").append(panelTitle);
        $("#collapseOne").append(panelBody);
        for(var i = 0;j=orderDetails.length, i < j; i++){
          var panelBodyContent = "<div class=\"row\"><div class=\"col-sm-3 \"><img style=\"height:80px\" src=\""+webFiles+orderDetails[i].thumbnail+"\" alt=\"商品图片\" class=\"img-thumbnail img-responsive center-block\"></div>" +
            "<div class=\"col-sm-5\"><h4>"+orderDetails[i].contract_name+"</h4><span class=\"label label-primary\" style=\"line-height: 1.25 !important;\">"+orderDetails[i].goodsType+"</span></div>" +
            "<div class=\"col-sm-3\"><h5 class=\"text-right text-primary\">售价：￥"+orderDetails[i].item_fee+"</h5><p class=\"text-right text-muted\" style=\"font-size:14px\">数量："+orderDetails[i].total+(orderDetails[i].bottles ? ('件 （'+orderDetails[i].bottles+'瓶/件）') : '瓶')+"</p></div>" +
            "</div>";
          if(j > 1){
            panelBodyContent = panelBodyContent + "<div style=\"height:10px\"></div>";
          }
          $("#collapseOne .panel-body").append(panelBodyContent);
        }
        layerFn.winRDom('商品详情','#accordion','680px',function(layerIndex,layero){},'关闭');
      },
      //查看隐藏部分是全部内容,用法 render : function(value,type,row,meta){return thisPage.rowColumnView(value);}
      rowColumnView : function(value){
        if(value == null || value == undefined) return '';
        //value = typeof value === 'string' ? value.replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;') : value;//好像有bug
        var len = value.length;
        if(len > 30){
          return "<a href='javascript:layerFn.viewValue(\""+value+"\",\"430px\");' title='点击查看详情' style='outline:none;text-decoration: none;'>"+value.substring(0,30)+"…</a>";
        }else{
          return value;
        }
      },
      complete: function(data,index,search){
        try{
          if(index){
            layerFn.closeIndex(index);
          }
          if(search){
            thisPage.search();
          }
          if(data){
            layerFn.handleResult(data.msg,data.code);
          }
        }catch(e){}
      }
    };
    thisPage.init();
    $('script').remove();
  })(jQuery);
</script>